﻿<div [@routerTransition] (window:resize)="onResize($event)">
    <div class="m-subheader">
        <div class="row align-items-center">
            <div class="mr-auto col-auto">
                <h3 class="m-subheader__title">
                    <span>{{"Maintenance" | localize}}</span>
                </h3>
            </div>
        </div>
    </div>
    <div class="m-content">
        <div class="m-portlet m-portlet--mobile">
            <div class="m-portlet__body">
                <tabset class="tab-container tabbable-line">
                    <tab heading=" {{'Caches' | localize}}" customClass="m-tabs__item">
                        <div class="row margin-bottom-10">
                            <div class="col-xl-6">
                                <p>{{"CachesHeaderInfo" | localize}}</p>
                            </div>
                            <div class="col-xl-6 text-right">
                                <button class="btn btn-primary" (click)="clearAllCaches()"><i class="fa fa-recycle"></i> {{"ClearAll" | localize}}</button>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xl-12">
                                <table class="table table-striped table-hover table-bordered">
                                    <tbody>
                                        <tr *ngFor="let cache of caches">
                                            <td>
                                                <span>{{cache.name}}</span>
                                                <button class="btn btn-primary btn-sm pull-right" (click)="clearCache(cache.name);">
                                                    {{"Clear" | localize}}
                                                </button>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </tab>
                    <tab heading="{{'WebSiteLogs' | localize}}" customClass="m-tabs__item">
                        <div class="row margin-bottom-10">
                            <div class="col-xl-6">
                                <p>{{"WebSiteLogsHeaderInfo" | localize}}</p>
                            </div>
                            <div class="col-xl-6 text-right">
                                <button class="btn btn-metal" (click)="downloadWebLogs()"><i class="fa fa-download"></i> {{"DownloadAll" | localize}}</button>
                                <button class="btn btn-primary" (click)="getWebLogs()"><i class="fa fa-sync"></i> {{"Refresh" | localize}}</button>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xl-12">
                                <div class="web-log-view full-height">
                                    <span class="log-line" *ngFor="let log of logs">
                                        <span [class]="getLogClass(log)">{{getLogType(log)}}</span>
                                        {{getRawLogContent(log)}}
                                    </span>
                                </div>
                            </div>
                        </div>
                    </tab>
                </tabset>
            </div>
        </div>
    </div>
</div>
